<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>管理员左侧部分页面</title>
<?php include_once("inc.php");?>
<style>
*,body{
	margin: 0;
	padding: 0;
	background-color: #616975;
}
.box{
	width: 220px;
	height: 300px;
	display: flex;
	position: absolute;
}
.ulList{
	width: 100%;
	display: flex;
	flex-direction: column;
	background-color: grey;
	position: absolute;
	list-style: none;
}
.liList{
	width: 100%;
	line-height:36px;
	display: flex;
	flex-direction: column;
	background-color: #616975;
	position: relative;
	border-bottom: 1px solid #33373d;
}
.liList p{
	font-size: 13px;
	font-weight:600;
	color: white;
}
.liList p img{
	margin-left:10px;
	margin-right:10px;
}
.liList ul{
	width: 100%;
	position: relative;
}
.liList ul li{
	width: 100%;
	height: 33px;
	line-height: 33px;
	background-color: #fff;
	list-style: none;
	position: relative;
	font-size: 12px;
}
.liList a{
	text-decoration:none;
}
.liList ul li img{
	margin-left:10px;
	margin-right:10px;
	background-color: white;
}
.liList ul li a{
	text-decoration: none;
	color: #878D95; 
	background-color: white;
}
.liList ul li a:hover{
	color: black;
}
/* .liList p:hover{
	background-color: #35afe3;
} */
</style>
<script>
	function menu_active(ulId){
		if(ulId.style.display == "none"){
			ulId.style.display = "block"
		}else{
			ulId.style.display = "none"
		}
	}
</script>
</head>
<body>
<div class="box">
	<ul class="ulList">
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulOne)">
					<img src="./images/system.png" style="vertical-align: middle;">系统设置
				</p>
			</a>
			<ul class="childUl" id="ulOne" style="display: none;">
				<li>
					<a href="password.php" target='main'><img src="./images/next.png" style="vertical-align: middle;">修改密码</a>
				</li>
        	</ul>
		</li>
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulTwo)">
					<img src="./images/classify.png" style="vertical-align: middle;">分类管理
				</p>
			</a>
			<ul class="childUl" id="ulTwo" style="display: none;">
				<li>
					<a href="category_list.php" target='main'><img src="./images/next.png" style="vertical-align: middle;">分类管理</a>
				</li>
        	</ul>
		</li>
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulThree)">
					<img src="./images/goods.png" style="vertical-align: middle;">商品管理
				</p>
			</a>
			<ul class="childUl" id="ulThree" style="display: none;">
				<li>
					<a href="goods_list.php" target='main'><img src="./images/next.png" style="vertical-align: middle;">商品管理</a>
				</li>
        	</ul>
		</li>
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulFour)">
					<img src="./images/news.png" style="vertical-align: middle;">公告管理
				</p>
			</a>
			<ul class="childUl" id="ulFour" style="display: none;">
				<li>
					<a href="news_list.php" target='main'>
						<img src="./images/next.png" style="vertical-align: middle;">公告管理
					</a>
				</li>
        	</ul>
        </li>
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulFive)">
					<img src="./images/web.png" style="vertical-align: middle;">网页管理
				</p>
			</a>
			<ul class="childUl" id="ulFive" style="display: none;">
				<li>
					<a href="about_list.php" target='main'>
						<img src="./images/next.png" style="vertical-align: middle;">网页管理
					</a>
				</li>
			</ul>
		</li>
		<li class="liList">
			<a href="#">
				<p onclick="menu_active(ulSix)">
					<img src="./images/users.png" style="vertical-align: middle;">用户管理
				</p>
			</a>
			<ul class="childUl" id="ulSix" style="display: none;">
				<li>
					<a href="http://localhost/QC_System/admin/user_list.php" target='main'>
						<img src="./images/next.png" style="vertical-align: middle;">用户管理
					</a>
				</li>
			</ul>
		</li>
    </ul>
</div>
</body>
</html>